<!-- INCLUDE sv_overall_header.html -->

<SCRIPT>
function validate()
{	
	var user_input = document.getElementById('user_input').checked;
	
	if (user_input)
	{		
		var name_suffix = document.getElementById('name_suffix').value;
		
		if (name_suffix == '')
		{
			$( "#dialog" ).html('{L_SV_INVALID_NAME}');
			$( "#dialog" ).dialog({			
				height: 70,
				modal: true			
			});
			return false;
		}
		
		var name = '{S_BASE_USERNAME}' + '(' + name_suffix + ')';		
		//alert(name);
		
		update_selected_name(name);
	}
	
	var selected_name = document.getElementById('selected_name').value;
	if (selected_name == '')
	{
		$( "#dialog" ).html('{L_SV_INVALID_NAME}');
		$( "#dialog" ).dialog({			
			height: 70,
			modal: true			
		});
		return false;	
	}
	
	return true;	
}

function update_selected_name(str)
{
	document.getElementById('selected_name').value = str;

}


</SCRIPT>


<div class="panel" > 
	<div class="inner"><span class="corners-top"><span></span></span> 
	<h2>{L_SV_NAME_CONFLICT}</h2> 
	</div>
	<p>{L_SV_NAME_CONFLICT_DESC}</p>
	
	<form id="name_conflict_form"  name="name_conflict_form" method="post" action="{S_NAME_CONFLICT_ACTION}" onsubmit="return validate();">
		
	<table border="0" cellpadding="5" cellspacing="5">
		
	<!-- IF S_OPTIONAL_NAME_1 != '' -->
		<tr>
			<td><p> <input type="radio" name="name_option" value="{S_OPTIONAL_NAME_1}" checked onClick="update_selected_name('{S_OPTIONAL_NAME_1}')"> </p></td>
			<td><p> {S_OPTIONAL_NAME_1} </p></td>
		</tr>
	<!-- ENDIF -->
		
	<!-- IF S_OPTIONAL_NAME_2 != '' -->
		<tr>
			<td><p> <input type="radio" name="name_option" value="{S_OPTIONAL_NAME_2}" onClick="update_selected_name('{S_OPTIONAL_NAME_2}')"> </p></td>
			<td><p> {S_OPTIONAL_NAME_2} </p></td>
		</tr>
	<!-- ENDIF -->
		
	<!-- IF S_OPTIONAL_NAME_3 != '' -->
		<tr>
			<td><p> <input type="radio" name="name_option" value="{S_OPTIONAL_NAME_3}" onClick="update_selected_name('{S_OPTIONAL_NAME_3}')"> </p></td>
			<td><p> {S_OPTIONAL_NAME_3} </p></td>
		</tr>
	<!-- ENDIF -->
		
	<!-- IF S_OPTIONAL_NAME_4 != '' -->
		<tr>
			<td><p> <input type="radio" name="name_option" value="{S_OPTIONAL_NAME_4}" onClick="update_selected_name('{S_OPTIONAL_NAME_4}')"> </p></td>
			<td><p> {S_OPTIONAL_NAME_4} </p></td>
		</tr>
	<!-- ENDIF -->
		
		<tr>
		
			<td><p> <input type="radio" name="name_option" id="user_input" onClick="document.getElementById('name_suffix').focus()"> </p></td>
			<td><p> {S_BASE_USERNAME}(
				<input type="text" id="name_suffix" maxlength="6" size="8"  title="{L_SV_INPUT_NAME}" onFocus='document.getElementById("user_input").checked=true'></input>
				)</p></td>
		</tr>
		
		<tr>
			<td><p> <input type="submit" name="login" value="{L_SV_SEND}" class="button2" /></p></td>
		</tr>
	</table>
	
	<input type="hidden" id="selected_name" name="selected_name" value="{S_OPTIONAL_NAME_1}">
	<input type="hidden" id="fb_user_info" name="fb_user_info" value="{S_FB_USER_INFO}">
	</form>
	
</div>



<div id="dialog" title="{L_SV_TIPS}" style="display:none;">
</div>

<!-- INCLUDE sv_overall_footer.html -->